import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:image_picker/image_picker.dart';

class FoundPage extends StatefulWidget {
  const FoundPage({Key key}) : super(key: key);

  @override
  _FoundPageState createState() => _FoundPageState();
}

class _FoundPageState extends State<FoundPage> {
  final List<String> images = [
    'https://tse1-mm.cn.bing.net/th/id/R-C.8dc53b01dd35329e4ef1743a27c63617?rik=X%2bQYO3TnwwbotA&pid=ImgRaw&r=0',
    'https://tse2-mm.cn.bing.net/th/id/OIP-C.sEeFJbq-AAhGnfUmnSA0ggHaH2?pid=ImgDet&rs=1',
    'https://tse1-mm.cn.bing.net/th/id/R-C.6e6481d5c3826851b7ad08e14c7d3ac6?rik=CFWlrHLRsGwJtw&riu=http%3a%2f%2f222.186.12.239%3a10010%2fzshb_170112%2f004.jpg&ehk=Gp1iavA%2bv%2bJCebLzePTIs2%2bh9UiKetW9Jsr80mcV%2bh0%3d&risl=&pid=ImgRaw&r=0',
    'https://tse1-mm.cn.bing.net/th/id/R-C.23c95f920fe7a02a3970b518dd8549f1?rik=7ky34YP0pCuMgQ&riu=http%3a%2f%2fimage.huahuibk.com%2fuploads%2f20190130%2f19%2f1548848229-mPJTRfvqWi.jpg&ehk=A6Lx8FZoDclsgS8VYiRBogxakCETNc2aZCwYosj6tpY%3d&risl=&pid=ImgRaw&r=0',
    'https://tse1-mm.cn.bing.net/th/id/R-C.7d45da258462b9f8c3c624b05ad17f14?rik=ALCPRXonvzkTyA&riu=http%3a%2f%2fimg.sucai.biz%2f180524%2f1-1P524231033.jpg&ehk=X15xgtoqGeXGGiPeuP9lNxijptoC01vWO7duPEvVE2w%3d&risl=&pid=ImgRaw&r=0',
    'https://www.zhongguofeng.com/uploads/allimg/180329/13-1P329112607.jpg',
    'https://tse1-mm.cn.bing.net/th/id/OIP-C.HYDbDGW1V-ZLNgJUD_-zSwHaHa?pid=ImgDet&rs=1',
  ];

  final ImagePicker _picker = ImagePicker();

  @override
  Widget build(BuildContext context) {
    return Stack(
      fit: StackFit.expand,
      children: [
        StaggeredGridView.countBuilder(
          crossAxisCount: 4,
          itemCount: 7,
          shrinkWrap: true,
          itemBuilder: (BuildContext context, int index) => Container(
            decoration: BoxDecoration(
              color: Colors.white,
              borderRadius: BorderRadius.circular(4),
            ),
            padding: EdgeInsets.only(top: 10, left: 10, right: 10),
            child: Column(
              mainAxisSize: MainAxisSize.min,
              children: [
                Image.network(images[index]),
                Align(
                  alignment: Alignment.centerRight,
                  child: _LikeWidget(),
                )
              ],
            ),
          ),
          staggeredTileBuilder: (int index) => StaggeredTile.fit(2),
          mainAxisSpacing: 16.0,
          crossAxisSpacing: 4.0,
        ),
        Align(
          alignment: Alignment(0.8, 0.8),
          child: FloatingActionButton(
            onPressed: () {
              showDialog(
                  context: context,
                  builder: (context) {
                    return AlertDialog(
                      title: Text('使用哪种方式'),
                      content: Column(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          ElevatedButton(
                            onPressed: () async {
                              await _picker.getImage(
                                  source: ImageSource.camera);
                              Navigator.of(context).pop();
                            },
                            child: Text('相机'),
                          ),
                          ElevatedButton(
                            onPressed: () async {
                              await _picker.getImage(
                                  source: ImageSource.gallery);
                              Navigator.of(context).pop();
                            },
                            child: Text('相册'),
                          ),
                        ],
                      ),
                    );
                  });
            },
            child: Icon(
              Icons.camera_alt,
              color: Colors.white,
              size: 22,
            ),
          ),
        )
      ],
    );
  }
}

class _LikeWidget extends StatefulWidget {
  const _LikeWidget({Key key}) : super(key: key);

  @override
  _LikeWidgetState createState() => _LikeWidgetState();
}

class _LikeWidgetState extends State<_LikeWidget> {
  bool _like = false;

  @override
  Widget build(BuildContext context) {
    return IconButton(
      onPressed: () {
        setState(() {
          _like = !_like;
        });
      },
      icon: Icon(
        Icons.favorite,
        color: _like ? Colors.red : Colors.grey,
        size: 22,
      ),
    );
  }
}
